<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="utf-8">
  <title>layui</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" th:href="@{/alllayui/layui/css/layui.css}"  media="all">
  <script th:src="@{/alllayui/layui/layui.js}" charset="utf-8"></script>
  <script th:src="@{/system/js/jquery.min.js}" charset="utf-8"></script>
  <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>

<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
  <legend>预订客房</legend>
</fieldset>

<form class="layui-form" action="">
  <div class="layui-form-item">
    <label class="layui-form-label">房间号</label>
    <div class="layui-input-block">
      <input type="text" name='rno'  th:value='${advance.rno}' lay-verify="required" lay-reqtext="房间号为必填项" placeholder="请输入房间号" autocomplete="off" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">联系人</label>
    <div class="layui-input-block">
      <input type="text" name='cname' th:value='${advance.cname}' lay-verify="required" lay-reqtext="联系人为必填项" placeholder="请输入联系人" autocomplete="off" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">联系电话</label>
    <div class="layui-input-block">
      <input type="text" name='phone' th:value='${advance.phone}' lay-verify="required" lay-reqtext="联系电话为必填项" placeholder="请输入联系电话" autocomplete="off" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">预订开始时间</label>
    <div class="layui-input-block">
      <input type="text" name='btime'  th:value='${advance.btime}' lay-verify="date"  lay-reqtext="添加时间为必填项" placeholder="请输入添加时间" autocomplete="off" class="layui-input datePicker">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">预定结束时间</label>
    <div class="layui-input-block">
      <input type="text" name='etime'  th:value='${advance.etime}' lay-verify="date"  lay-reqtext="添加时间为必填项" placeholder="请输入添加时间" autocomplete="off" class="layui-input datePicker">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">前台操作员</label>
    <div class="layui-input-block">
      <input type="text" name='userid'  th:value='${advance.userid}' lay-verify="required" lay-reqtext="电子邮箱为必填项" placeholder="请输入电子邮箱" autocomplete="off" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">操作时间</label>
    <div class="layui-input-block">
      <input type="text" name='otime'  th:value='${advance.otime}' lay-verify="date"  lay-reqtext="添加时间为必填项" placeholder="请输入添加时间" autocomplete="off" class="layui-input datePicker">
    </div>
  </div>
  <div class="layui-form-item">
    <div class="layui-input-block">
      <button type="submit" class="layui-btn" lay-submit="" lay-filter="subBtn">提交</button>
    </div>
  </div>
</form>
<script>
  layui.use(['jquery','form','laydate'], function(){
    var thisIndex = parent.layer.getFrameIndex(window.name);
    var form = layui.form
            ,layer = layui.layer
            ,$ = layui.$ ;

    var laydate = layui.laydate;

    //同时绑定多个
    lay('.datePicker').each(function(){
      laydate.render({
        elem: this
        ,trigger: 'click'
      });
    });

    //同时绑定多个
    $(document).on('click','.foreignKey',function(){
      let fkAttr = $(this).attr("fkAttr");
      //iframe层-父子操作
      if(fkAttr!=""){
        layer.open({
          type: 2,
          area: ['700px', '450px'],
          fixed: false, //不固定
          maxmin: true,
          content: '/roomadvance/choosePage?fkName=' +  fkAttr
        });
      }
    });

    var parentLayer = parent.layer;
    var pWindow = parent ;
    form.on('submit(subBtn)', function(data){
      let data2Send = data.field;
      $.ajax({
        type: "post",
        url: "/roomadvance/add",
        data: data2Send,
        dataType: "json",
        success: function(res){
          var msg = "";
          console.log(res.message);
          if (res.message === 'SUCCESS') {
            msg = '修改成功!窗口关闭';
          } else {
            msg = '修改失败!窗口关闭'
          }
          parentLayer.msg(msg, {
            icon: 1,
            time: 1000
          }, function () {
            parentLayer.close(thisIndex);
            pWindow.document.getElementById('searchBtn').click();
          });
        }
      });
    });
  });

  function coverValue(coverValueColumn,chooseInfo) {
    //console.log("父页面");
    //console.log(coverValueColumn);
    //console.log(chooseInfo);
    let parse = JSON.parse(coverValueColumn);
    var valObj  ;
    if(chooseInfo){
      valObj = chooseInfo[0];
    }
    //console.log(valObj);
    for(let i=0;i<parse.length;i++){
      var coverObj = parse[i];
      setFormValue(coverObj.mTable,valObj[coverObj.rSql]);
    }
  }

  function setFormValue(componentId,val) {
    document.getElementsByName(componentId)[0].value = val;
  }

</script>

</body>